<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
	<title>q1容易混淆的元字符|&?</title>
	<style type="text/css">
	* {
		padding: 0;
		margin: 0;
	}
    </style>
</head>
<body>
	<div class="container">
		<h1>q1容易混淆的元字符|&?</h1>
	</div>
	<script src="https://cdn.staticfile.org/jquery/3.2.0/jquery.js"></script>
	<script type="text/javascript">
	
	function log (... args) {
		let isPrint = 0 ;
		if(!isPrint) return ;
		console.log(...args);
	}




	// 正则表达式或者 |, 比如: x|y
	//  /\d{5}-\d{4}|\d{5}/  ===> /(\d{5}-\d{4})|(\d{5})/  | 左右两边全部部分，而不是单个字符
	var reg = /\d{5}-\d{4}|\d{5}/
	var str = '03231'
	log(reg.exec(str))
	var str = '03231-3222'
	log(reg.exec(str))

	// 顺序调整一下
	var reg2 = /\d{5}|\d{5}-\d{4}/
	log(reg2.exec(str))  // 只会匹配 03231(\d{5}) 9位邮编的前5位
	// 原因： 匹配分枝条件时，将会从左到右地测试每个条件，如果满足了某个分枝的话，就不会去再管其它的条件了。
	// 所以要将更难得条件放在最左边  /\d{5}-\d{4}|\d{5}/

	/*
		test: /\.(png)|(jpg)|(gif)|(jpeg)$/,
		exclude: /(node_modules|bower_components)/,
		test: /\.(png|svg|jpg|jpeg|gif)$/,
		test: /\.(woff|woff2|eot|ttf|otf)$/,
		test: /\.(jpg|gif|jpeg|png)$/,
		exclude: /(node_modules|bower_components)/,
	 */

	 // ？相对于| 匹配单个字符(单个组)
	 var reg = 'https?://baidu.com'
	 var str = '百度的地址: http://baidu.com百度一下就知道'
	 console.log(str.match(reg))
	 

	</script>
</body>
</html>